﻿@using MyWebApp.Models
@{
    AdminModels cModel = ViewBag.CommolModels;
    ViewBag.bgClass = "hold-transition skin-blue sidebar-mini";
    Layout = "~/Views/Shared/_LayoutBase.cshtml";
}

@section Head{
    @Styles.Render("~/Content/DataTables")
    @RenderSection("Head", false)
}

<div class="wrapper">
    <header class="main-header">
        <!-- Logo -->
        <a href="#" class="logo">
            <!-- mini logo for sidebar mini 50x50 pixels -->
            <span class="logo-mini"><b>W</b>AbPP</span>
            <!-- logo for regular state and mobile devices -->
            <span class="logo-lg"><b>Web</b>App 后台管理</span>
        </a>
        <!-- Header Navbar: style can be found in header.less -->
        <nav class="navbar navbar-static-top">
            <!-- Sidebar toggle button-->
            <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
                <span class="sr-only">Toggle navigation</span>
            </a>-
            <!-- Navbar Right Menu -->
            <div class="navbar-custom-menu">
                <ul class="nav navbar-nav">
                    <li>
                        <a href="/Security/LockScreen?ReturnUrl=@ViewBag.CurUrl" ><i class="fa fa-lock">锁屏</i></a>
                    </li>
                    <!-- Notifications: style can be found in dropdown.less -->
                    @Html.Partial("_PartialNotification", cModel.MyNotification)
                    <!-- User Account: style can be found in dropdown.less -->
                    @Html.Partial("_PartialLoginUser", cModel.CurUser)
                    <!-- Control Sidebar Toggle Button -->
                    <li>
                        <a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
                    </li>
                </ul>
            </div>
        </nav>
    </header>

    <!-- Left side column. contains the logo and sidebar  左侧菜单部分-->
    @Html.Partial("_PartialMenu", cModel.Menus)

    <!-- 中间内容部分-->
    <div class="content-wrapper">
        @RenderBody()

        @*<!-- Content Header (Page header)-->
            <section class="content-header">
                <h1>
                </h1>
                <ol class="breadcrumb">
                    <li><a href="#"><i class="fa fa-dashboard"></i><span id="spPath"></span></a></li>
                </ol>
            </section>
            <!-- Main content -->
            <section class="content">

            </section>*@
    </div>
    <!-- /.content-wrapper -->
    <!-- Main Footer -->
    <footer class="main-footer">
        <!-- To the right -->
        <div class="pull-right hidden-xs">
            Anything you want
        </div>
        <!-- Default to the left -->
        <strong>Copyright &copy; 2015-2017 <a href="#">Boco Company</a>.</strong> All rights reserved.
    </footer>

    <!-- Control Sidebar 设置-->
    <aside class="control-sidebar control-sidebar-dark">
        <!-- Create the tabs 多tab-->
        <ul class="nav nav-tabs nav-justified control-sidebar-tabs">
            <li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
        </ul>
        <!-- Tab panes -->
        <div class="tab-content">
            <!-- Settings tab content -->
            <div class="tab-pane" id="control-sidebar-settings-tab">
                <form method="post">
                    <h3 class="control-sidebar-heading">General Settings</h3>

                    <div class="form-group">
                        <label class="control-sidebar-subheading">
                            Report panel usage
                            <input type="checkbox" class="pull-right" checked>
                        </label>

                        <p>
                            Some information about this general settings option
                        </p>
                    </div>
                    <!-- /.form-group -->

                    <div class="form-group">
                        <label class="control-sidebar-subheading">
                            Allow mail redirect
                            <input type="checkbox" class="pull-right" checked>
                        </label>

                        <p>
                            Other sets of options are available
                        </p>
                    </div>
                    <!-- /.form-group -->

                    <div class="form-group">
                        <label class="control-sidebar-subheading">
                            Expose author name in posts
                            <input type="checkbox" class="pull-right" checked>
                        </label>

                        <p>
                            Allow the user to show his name in blog posts
                        </p>
                    </div>
                    <!-- /.form-group -->

                    <h3 class="control-sidebar-heading">Chat Settings</h3>

                    <div class="form-group">
                        <label class="control-sidebar-subheading">
                            Show me as online
                            <input type="checkbox" class="pull-right" checked>
                        </label>
                    </div>
                    <!-- /.form-group -->

                    <div class="form-group">
                        <label class="control-sidebar-subheading">
                            Turn off notifications
                            <input type="checkbox" class="pull-right">
                        </label>
                    </div>
                    <!-- /.form-group -->

                    <div class="form-group">
                        <label class="control-sidebar-subheading">
                            Delete chat history
                            <a href="javascript:void(0)" class="text-red pull-right"><i class="fa fa-trash-o"></i></a>
                        </label>
                    </div>
                    <!-- /.form-group -->
                </form>
            </div>
            <!-- /.tab-pane -->
        </div>
    </aside>
    <!-- /.control-sidebar -->
    <!-- Add the sidebar's background. This div must be placed immediately after the control sidebar -->
    <div class="control-sidebar-bg"></div>
</div>
<!-- ./wrapper -->

@section scripts{
    @Scripts.Render("~/bundles/DataTables")
<script src="~/Scripts/jquery-validation/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery-validation/myadd-method.js"></script>
<script src="~/Scripts/jquery-validation/messages_zh.min.js"></script>
    <script type="text/javascript">
        $().ready(function() {
            setMenu();
        });

        var setMenu = function () {
            // 左侧菜单高亮
            var url = window.location;
            // for treeview
            $('ul.treeview-menu a').filter(function () {
                return this.href == url;
            }).closest('.treeview').addClass('active').siblings().removeClass('active');

            // for sidebar menu entirely but not cover treeview
            $('ul.sidebar-menu a').filter(function () {
                return this.href == url;
            }).parent().parent().parent().addClass('active').siblings().removeClass('active');

            $('ul.sidebar-menu a').filter(function () {
                return this.href == url;
            }).parent().addClass('active').siblings().removeClass('active');
        }

        //validator 默认设置
        jQuery.validator.setDefaults({
            debug: true,
            success: "valid",
            //highlight: function (element) {
            //    $(element).closest('.form-group').addClass('has-error');
            //},
            //unhighlight: function (element) {
            //    $(element).closest('.form-group').removeClass('has-error');
            //},
            //自定义错误消息放到哪里
            errorPlacement: function (error, element) {
                element.next().remove();//删除显示图标
                element.after('<span class="glyphicon glyphicon-remove form-control-feedback" aria-hidden="true"></span>');
                element.closest('.form-group').append(error);//显示错误消息提示
            },
            //给未通过验证的元素进行处理
            highlight: function (element) {
                $(element).closest('.form-group').addClass('has-error has-feedback');
            },
            //验证通过的处理
            success: function (label) {
                var el = label.closest('.form-group').find("input");
                el.next().remove();//与errorPlacement相似
                //el.after('<span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>');
                label.closest('.form-group').removeClass('has-error');//.addClass("has-feedback has-success");
                label.remove();
            },
        });

        //dataTable 默认配置
        $.extend(true, $.fn.dataTable.defaults, {
            "serverSide": true, //服务端处理
            "ordering": false,  //排序
            "processing": true, //查询中
            "bAutoWidth": true, //自动宽度
            "paging": true,  //分页
            "pagingType": "full_numbers", //分页样式
            "searching": false, //查询条件
            "bFilter": false,  //过滤条件
            "info": true,  //信息
            //"dom": '<"top">rt<"bottom"lip><"clear">',  //页面布局
            //"<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>"
            "dom": "<'row-fluid'r>t<'row-fluid'<'col-xs-2'l><'col-xs-2'i><'col-xs-8'p>>",//定义DataTable布局的一个强大属性
            "scrollX": true,//横向滚动
            'bStateSave': true,//保存客户端状态
            "lengthMenu": [[5, 10, 25,50, -1], [5, 10, 25,50, "All"]],  //设置分页可选项
            "language": {
                "loadingRecords": "加载中...",
                "lengthMenu": "每页显示 _MENU_ 条",
                "emptyTable": "抱歉， 没有找到符合条件的数据",
                "zeroRecords": "抱歉， 没有找到符合条件的数据",
                "info": "从 _START_ 到 _END_ /共 _TOTAL_ 条数据",
                "paginate": {
                    "first": "首页",
                    "last": "尾页",
                    "next": "下一页",
                    "previous": "上一页"
                },
                "infoFiltered": "",
                "infoEmpty": "无结果"
            },
        });
    </script>
    @*<script type="text/javascript">
            $().ready(function () {
                $('.treeview-menu > li').click(function () {
                    $(this).addClass('active').siblings().removeClass('active');
                });
                $('.sidebar-menu li').click(function () {
                    var url = $(this).attr('data-url');
                    if (url != undefined && url.length > 0) {
                        console.info(url.length);
                        $('#iframeOne').attr('src', url);
                        return false;
                    }
                });
            });
        </script>*@
    @RenderSection("scripts", required: false)
}
